page{
	background-color: $uni-bg-color-grey;
}

view,scroll-view,swiper,swiper-item{
	box-sizing: border-box;
}

.container{
	width: 100vw;
	height: 100vh;
	background-color: $uni-bg-color-grey;
}
.header{
	position: fixed;
	z-index: 10;
	width: 100%;
	height: 110rpx;
	.search-box{
		position: relative;
		background-color: $uni-bg-color-grey;
		border-radius: 10rpx;
		padding: 10rpx 20rpx;
		.search-img{
			width: 30rpx;
			height: 30rpx;
			position: absolute;
			right: 20rpx;
			top: 16rpx;
		}
	}
}

.main{
	padding-top: 110rpx;
	.category-box{
		scroll-view{
			height: calc(100vh - 110rpx);
			.item{
				position: relative;
				text-align: center;
				font-size: 26rpx;
				padding: 30rpx 0;
				color: #737373;
			}
			.item.active{
				background-color: white;
			}
			.item.active::before{
				position: absolute;
				top: 20%;
				left: 0;
				content: "";
				width: 10rpx;
				height: 60%;
				background-color: $theme-color;
			}
		}
	}
	.list-box{
		background-color: white;
		
		.order,.picker-item-box{
			color: #737373;
		}
		.picker-item-box{
			padding: 10rpx 0;
			border-bottom: 1rpx solid #eee;
		}
		.picker-item-box .option{
			min-width: 200rpx;
			padding: 10rpx 30rpx;
		}
		.picker-item-box .active{
			color: $theme-color;
		}
		.greet-scroll-view{
			height: calc(100vh - 110rpx - 110rpx);
		}
		.item{
			margin: 20rpx 30rpx;
			border-bottom: 1rpx solid #eee;
		}
		.footer{
			padding: 20rpx 0;
			.quanity{
				font-size: 24rpx;
				color: #AAB0BC;
			}
			.copy{
				display: flex;
				flex-direction: row;
				background-color: $theme-color;
				border-radius: 25rpx;
				padding: 8rpx 20rpx;
			}
			.copy .title{
				font-size: 22rpx;
				padding-left: 4rpx;
				padding-bottom: 2rpx;
			}
		}
	}
}

.uni-button{
	display: inline-flex;
	padding: 0;
	margin: 0;
	border-radius: 0;
	background-color: transparent;
	line-height: normal;
}
.uni-button::after{
	border: none;
}
.load-box{
	width: 100%;
	height: 20%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}